<template>
    <div class="edit-dialog-page">

    </div>
</template>

<script>
import {getAddPlan,getYear,getListingDetail,getEditPlan,getUpdateStag,getDelete} from'@/api/manage/annualPlan'
    export default {
        name:'editDialog',
        props: {
            showDialog: {
                type: Boolean,
                default: ''
            },
            type:{
                type: String,
                default: ''
            },
            proid:{
                type: String,
                default: ''
            }
        },
        data(){
            return{
                rules:{
                    name:[
                        {required: true, message: '请输入计划名称', trigger: 'blur' }
                    ],
                    year:[
                        {required: true, message: '请选择年份', trigger: 'change' }
                    ],
                    startTime:[
                        {required: true, message: '请选择起始时间', trigger: 'change' }
                    ],
                    endTime:[
                        {required: true, message: '请选择结束时间', trigger: 'change' }
                    ],
                },
                ruleForm:{

                },
                yearArr:[],
                title:'年度项目清单计划'
            }
        },
        watch:{
            showDialog(val){
                // this.$refs['ruleFormRf'].clearValidate()
                if(val){
                    if(this.type=='add'||this.type=='edit'){
                        // this.$refs.ruleFormRf.clearValidate()
                        console.log(this.$refs.ruleFormRf)
                        getYear().then(res =>{
                            if(res.code==200){
                                this.yearArr=res.year
                                this.title="年度项目清单计划"
                            }
                            // console.log(res)

                        })
                    }else if(this.type=='stop'){
                        this.title="暂停"
                    }else if(this.type=='start'){
                        this.title="启动"
                    }else{
                        this.totle='年度项目审核'
                    }
   
                    if(this.type=='edit'){
                        getListingDetail(this.proid).then(res =>{
                            this.ruleForm={
                                'name':res.name,
                                'year':res.year,
                                'startTime':res.startTime,
                                'endTime':res.endTime
                            }
                        })
                    }
                }
            }
        },
        methods:{
            handleClose() {
                this.$emit("changeShowDialog", "false"); //调用父组件的自定义事件，并传值
            },
            /** 确定按钮 */
            submitForm() {
                this.ruleForm.projectId=this.proid
                console.log(this.type)
                let TYPE=this.type
                this.$refs['ruleFormRf'].validate((valid) => {
                    console.log(valid)
                    if(valid){
                        console.log(valid)
                    }else{
                        return false;
                        console.log()
                    }
                })
                if(TYPE=='add'){
                    this.getPlanAdd()
                }else if(TYPE=='edit'){
                    this.getPlanEdit()
                }else if(TYPE=='start'||TYPE=='stop'){
                    this.getStutsChange()
                }else if(TYPE=='del'){
                    this.getDeleteList()
                }

                // this.resetForm()
                
            },
            //新增项目
            getPlanAdd(){
                getAddPlan(this.ruleForm).then(res =>{
                })
            },
            //修改项目
            getPlanEdit(){
                // this.ruleForm.planId=this.proid
                getEditPlan(this.proid,this.ruleForm).then(res =>{
                })
            },
            //修改状态，启动<=>暂停
            getStutsChange(){
               getUpdateStag(this.proid).then(res =>{
               }) 
            },
            //删除项目
            getDeleteList(){
                getDelete(this.proid).then(res =>{
                })
            },
            resetForm(){
                console.log('1234')
                this.$refs.ruleFormRf.resetFields();
                this.ruleFor={
                    name:'',
                    year:'',
                    startTime:'',
                    endTime:'',
                }
            }
        } 
    }
</script>

<style lang="scss" >
.edit-dialog-page{
    .del-box{
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 16px;
        font-family: PingFang SC, PingFang SC-Medium;
        font-weight: 500;
        color: #000000;
        margin-bottom: 10px;
        img{
            margin-right:10px;
        }
    }
}
.edit-dialog-page .el-dialog{
  display: flex;
  flex-direction: column;
  margin:0 !important;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  /*height:600px;*/
//   max-height:calc(100% - 30px);
  max-width:calc(100% - 30px);
}
.edit-dialog-page .el-dialog .el-dialog__body{
  flex:1;
  overflow: auto;
}
.edit-dialog-page .el-form-item .el-input__inner{
    width:400px;
}
.edit-dialog-page .el-textarea__inner{
     width:400px;
}
.edit-dialog-page .el-dialog__header{
    border-bottom:1px solid #ebecef;
}
.edit-dialog-page .el-dialog__footer{
    border-top:1px solid #ebecef;
}
.edit-dialog-page .el-form-item__content{
    width:400px;
}
</style>